<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<!DOCTYPE html>
<html>
<head>
	<%@ include file="../base.jsp" %>
	<style>
	.content-wrapper{margin-left: 0px}
		.error{color:red;font-weight: 500;}
		.external-event{  
		  cursor: pointer;
		}
		.hide11{display: none;}
		.dd{background: #DDD;}
	</style>
</head>
<body class="hold-transition skin-blue sidebar-mini">
	<div class="wrapper">
		<!-- Content Wrapper. Contains page content -->
		<div class="content-wrapper">
			<!-- Main content -->
			<section class="content">
				<div class="row">
					<div class="col-md-3">
			          <div class="box box-solid">
			            <div class="box-header with-border">
			              <h4 class="box-title">选择视图</h4>
			            </div>
			            <div class="box-body">
			              <!-- the events -->
			              <div id="external-events">
			              	<c:forEach items="${veiwlist }" var="list">
			                	<div class="external-event" onclick="chekview(this,'${list.viewid }',${list.viewrows },${list.viewcols },'${list.viewname }')">${list.viewname }</div>
			                </c:forEach>
			              </div>
			            </div>
			            <!-- /.box-body -->
			          </div>
			          <!-- /.box -->
			        </div>
					<div class="col-md-9">
			          <div class="box">
			            <!-- /.box-header -->
			            <div class="box-body">
			              <table class="table table-bordered" id="mytable">
			              </table>
			            </div>
			            <!-- /.box-body -->
			            <div class="box-footer" style="text-align: center;">
			                <a class="btn btn-primary" id="confirm1">确定</a>
			                <a class="btn btn-warning" id="cancel1">取消</a>
			           </div>
			          </div>
				</div>
			</section>
		</div>
	</div>
<form id="publishForm">
	<input type="hidden" name="viewid" id="viewid" value="">
	<input type="hidden" name="querysql" id="querysql" value="${publishChart.querysql }">
	<input type="hidden" name="xzhou" id="xzhou" value="${publishChart.xzhou }">
	<input type="hidden" name="yzhou" id="yzhou" value="${publishChart.yzhou }">
	<input type="hidden" name="charttype" id="charttype" value="${publishChart.charttype }">
	<input type="hidden" name="chartname" id="chartname" value="${publishChart.chartname }">
	<input type="hidden" name="areaid" id="areaid" value="${publishChart.areaid }">
	<input type="hidden" id="myview" value="">
</form>
<script type="text/javascript">
function chekview(obj,viewid,viewrows,viewcols,viewname){
	$("#viewid").val(viewid);
	
	$.post(path+'/analysis/chart/getViewByID',{viewid:viewid},function(data){
		console.dir(data);
		
		var html = "";
		var n = 0;
		for (var i = 0; i < viewrows; i++) {
			html += "<tr>";
			for (var j = 0; j < viewcols; j++) {
				n++;
				console.dir(data["'"+n+"'"]);
				var charttype = data[n].charttype;
				var typename = "";
				if(charttype == 1){typename = "柱状图";}
				else if(charttype == 2){typename = "折线图";}
				else if(charttype == 3){typename = "饼状图";}
				else if(charttype == 4){typename = "散点图";}
				 
				var ischeck = "false";
				if(!data[n].chartname || data[n].charttype == 'None'){
					ischeck = "true";
				}
				
				var chartname = ""
				if(data[n].chartname){
					chartname = data[n].chartname;
				}
				
				html += "<td class=\"\" onclick=\"chktd(this,"+n+",'"+ischeck+"')\">图表名称： "+chartname
					+"<br>视图名称： "+data[n].viewname+"<br>类型： "+typename+"<br>区域： "+n+"<br></td>";
			}
			html += "</tr>";
		}
		$("#mytable").html(html);
	});
	$("#external-events").find("div").removeClass("dd");
	obj.className += " dd";
	
}

function chktd(obj,areaid,ischk){
	if(ischk == 'false'){
		layer.alert("该区域已经被选中，请重新选择");
		return;
	}
	$("#areaid").val(areaid); 
	
	$("#mytable").find("td").removeClass("dd");
	obj.className += " dd";
}

$(function () {
	$("#confirm1").on("click",function(){
		var areaid = $("#areaid").val();
		if(!areaid){
			layer.alert("请选择区域");
			return;
		}
		var loadindex = layer.load(0,{shade:[0.8,'#333']});
		$.ajax({
			url: path+'/analysis/chart/publishchart',
			data:$("#publishForm").serialize(),
			type:"POST",
			success: function(result){
				layer.close(loadindex);
				layer.alert("发布成功",{closeBtn:0},function(){
					parent.layer.closeAll();
					top.document.location.href = "${url}analysis/chart/chartList";
				})
			}
        });
		//parent.location.href = 
	})

	$("#cancel1").on("click",function(){
		parent.layer.closeAll();
	})
});
</script>
</body>
</html>
